<template>
  <view>
    <YgSearch></YgSearch>
    <u-tabs active-color="#eb4450" bar-width="100" bar-height="4"  :list="list" :is-scroll="false" :current="current" @change="change"></u-tabs>
    <view class="goods">
      <view class="sale" v-if="current===0">
        <navigator v-for="item in goods" :key="item.goods_id" :url="'/pages/goods_detail/goods_detail?goods_id='+item.goods_id">
          <view class="goods_img" >
            <u-image width="100%" mode="widthFix" :src="item.goods_small_logo||'http://image4.suning.cn/uimg/b2c/newcatentries/0000000000-000000000775604287_1_400x400.jpg'"></u-image>
          </view>
          <view class="goods_info">
            <view class="goods_name">{{item.goods_name}}</view>
            <view class="goods_price"><text> ￥ </text>{{item.goods_price}}</view>
          </view>
        </navigator>
      </view>
      <view v-else-if="current===1">综合</view>
      <view v-else-if="current===2">价格</view>
    </view>
  </view>
</template>

<script>
const params = {
	// 否	string	关键字
  query:'',
	// 否	string	分类id
  cid:'',
	// 否	number	页码
  pagenum:1,
	// 否	number	页容量
  pagesize:10,
}
export default {
  async onLoad({cid}){
    params.cid=cid
    this.getGoods()
  },
  data() {
		return {
				list: [
          {name: '销量'},
          {name: '综合'}, 
          {name: '价格'	}
        ],
        current:0,
        goods:[],
        total:0
		}
	},
  methods:{
    // tab切换
    change(index){
      console.log(index);
      this.current=index
    },
    // 获取信息
    async  getGoods(){
      const res = await this.$u.get('/goods/search',params)
      console.log(res);
      this.goods = [...this.goods,...res.message.goods]
      this.total=res.message.total
      console.log(this.total);
      // console.log(this.goods);
    }
  },
  // 下拉触底
  onReachBottom(){
    if(this.goods.length>=this.total){
      wx.showToast(
        {title:'我是有底线的',icon:'none'}
      )
    }else{
      params.pagenum++
      this.getGoods()
    }
  },
  async onPullDownRefresh(){
    params.pagenum=1
    this.goods=[]
    await this.getGoods()
    wx.stopPullDownRefresh()
  }
}
</script>

<style lang="scss">
.goods{
  .sale{
    navigator{
      display: flex;
      padding: 0 25rpx;
      .goods_img{
        flex: 1;
      }
      .goods_info{
        padding-left: 15rpx;
        flex: 2;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        .goods_price{
          color: #eb4450;
          text{
            font-size: 26rpx;
          }
        }
      }
    }
  }
  
}

</style>